<template>
  <PageWrapper title="批量导入任务">
    <div class="flex-row" style="height: 50px;line-height: 50px">
      <ImpExcel  @success="loadDataSuccess" dateFormat="YYYY-MM-DD">
        <a-button class="m-3"> 导入Excel </a-button>
      </ImpExcel>
      <div class="flex-1 flex-row justify-right">
        <a style="line-height: 32px;height: 32px"  href="/resource/excel/excel_task_import_model.xlsx" download="excel_task_import_model.xlsx"> 下载Excel模版 </a>
        <a-button class="m-3"  v-if="hasPermission('addDept')" type="primary" :disabled="tableListRef.length==0" @click="handleSave"> 保存 </a-button>
      </div>
    </div>
    <BasicTable
      v-for="(table, index) in tableListRef"
      :key="index"
      :title="table.title"
      :columns="table.columns"
      :dataSource="table.dataSource"
    />
    <div class="tips" v-if="tableListRef.length==0">
      <p>操作步骤:</p>
      <p>1.下载并填写Excel模版</p>
      <p>2.选择文件导入Excel</p>
      <p>3.确认信息无误后点击保存</p>
      <p>字段说明：</p>
      <p>任务类型：1=教学类，2=教科研，3=教科研建设	，4=管理与公共服务	</p>
      <p>审核员ID：到"系统管理->账号管理" 查看对应账号的账号ID	</p>
    </div>
  </PageWrapper>
</template>
<style lang="css">
.flex-row{
  display: flex;
  align-items: center;
}
.flex-1{
  flex: 1;
}
.justify-right{
  justify-content: right;
}
.tips{
  width: 100%;
  text-align: center;
  font-size: 14px;
  color: #999;
  padding-top: 100px;
}
</style>
<script lang="ts">
import { defineComponent, ref } from 'vue';
const { hasPermission } = usePermission();

import { ImpExcel, ExcelData } from '/@/components/Excel';
import { BasicTable, BasicColumn } from '/@/components/Table';
import { PageWrapper } from '/@/components/Page';
import { usePermission } from "/@/hooks/web/usePermission";
import { TeacherAddList } from "/@/api/teacher/teacher";
import { useMessage } from "/@/hooks/web/useMessage";
import {taskCenterAddList} from "/@/api/taskCenter/taskCenter";

export default defineComponent({
  components: { BasicTable, ImpExcel, PageWrapper },

  setup() {
    const { createMessage } = useMessage();

    let excelData:any[] = [];
    const tableListRef = ref<
      {
        title: string;
        columns?: any[];
        dataSource?: any[];
      }[]
      >([]);

    function loadDataSuccess(excelDataList: ExcelData[]) {
      tableListRef.value = [];
      excelData = excelDataList[0].results;
      console.log('results',excelDataList[0].results);
      for (const excelData of excelDataList) {
        const {
          header,
          results,
          meta: { sheetName },
        } = excelData;
        const columns: BasicColumn[] = [];
        for (const title of header) {
          columns.push({ title, dataIndex: title });
        }
        tableListRef.value.push({ title: sheetName, dataSource: results, columns });
      }
    }
    function handleSave(){
      if(excelData.length>0){
        const create_time = new Date().getTime();

        excelData = excelData.map(item=>{
          return {
            title:item['任务标题'],
            content:item['任务内容'],
            digest:item['摘要'],
            task_type:item['任务类型'],
            reward:item['奖励点数'],
            reward_unit:item['奖励单位'],
            auditor_id:item['审核员id'],
            super_auditor_id:item['二次审核员id'],
            sort:0,
            delete_time:0,
            create_time:Number(create_time/1000),
            status:0,
            need_report:1

          }
        })
        taskCenterAddList(excelData).then((res:any)=>{
          createMessage.success(`操作成功,跳过${res.error_count}`)
          tableListRef.value = []
        }).catch(()=>{
          createMessage.error('数据导入失败');
        })
      }else {
        createMessage.error('请先导入excel');
      }
    }

    return {
      hasPermission,
      loadDataSuccess,
      tableListRef,
      handleSave,
    };
  },
});
</script>
